Un anónimo me preguntaba la forma de añadir una imagen de fondo a los títulos de la sidebar.
Dentro de "Sidebar Content" está .sidebar h2{ pero no en todas las plantillas aparece igual, para los que NO ubiquen .sidebar h2{ en su plantilla deben situarse en:

/* Sidebar Content
-------------------- */

y añadir lo siguiente:

.sidebar h2{
background: url(url-de-la-imagen);
margin:0;
padding-left: 30px;
padding-top: 1px;
padding-bottom: 5px;
}

El efecto será una imagen de fondo justo detrás de los títulos.


Hay otras posibilidades para decorar los títulos de la sidebar. Si en .sidebar h2{ en lugar de añadir una imagen de fondo queremos añadir color bastaría con incluir:
background-color: #000000; (sustituyendo #000000 por un color de vuestro agrado)


La imaginación es la que cuenta a la hora de darle un toque personal a nuestra sidebar, también podemos enmarcarlo con:
border-top: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;

El grosor de la línea lo podemos modificar aumentando 1px. El enmarcado también podemos escogerlo si en lugar de una línea recta sustituimos "solid" por otro borde.


¿Y por qué no, una sencilla línea con un icono?

background: url(url-de-la-imagen) no-repeat;
border-bottom: 2px solid #000000;


Podríamos pasar un día entero modificando los títulos de nuestra sidebar, seguramente en las páginas donde ofrecen plantillas encontraremos ideas para llevar a la práctica, donde y como agregar el código ya lo sabemos ahora queda probar.
Marta Nieves Montero González

¡Buenos días mi estimada Gema!

Ante todo, quisiera pedir disculpas a mis compañer@s por utilizar esta forma de comunicarme contigo, pero me es imposible por cualquier otro medio.

Te he mandado un correo explicándote todo pero, o no lo recibistes o lo borrastes al no conocerme. En cualquier caso, en él expongo mi admiración y mi agradecimiento a tu persona, a tus enseñanzas y a tu enorme generosidad y paciencia. De ésta última, creo que vas a necesitar mucha conmigo porque soy más que torpe, soy ignorante en este medio pero, mi ilusión me ha llevado a hacer un blog que espera ansioso tu visita, tus reproches o tu aprobación porque te considero toda una maestra en estos lares.

Me llamo Vesta (perdona por la tardanza en la presentación), mi blog se llama: "En busca de la armonía del alma" y su dirección es: http://enbuscadelaarmoniadelalma.blogspot.com/

Espero que no me tomes a mal esta intrusión y sepas perdonarme.

Muchas gracias por dedicarme tu tiempo y ¡hasta pronto, cómplice!

Vesta, desde mi corazón

Responder
Marta Nieves Montero González

¡¡¡Holaaaaaaaaaaaaaaaaaa!!!

¡¡Sí, sí, sí!!

¡¡Por fin lo conseguí!!

He conseguido personalizar mis títulos de la sidebar gracias a tí, mi queridísima Gema.

¡¡GRACIASSSSSSSSSSSSSS!!

Besitos,

Vesta, desde mi corazón

Responder
JeJo

Bueníssssssimo !
ASÍ se explica un toturial !!!!
Te Felicito, Genia ...

Responder
Iván

Me ha costado pero al final he conseguido hacerlo. Y llevaba tiempo queriendo cambiar mis títulos...
MIL GRACIAS!!!

Responder
Anónimo

¿Y si Dios fuera mujer?
pregunta Juan sin inmutarse,
vaya, vaya si Dios fuera mujer
es posible que agnósticos y ateos
no dijéramos no con la cabeza
y dijéramos sí con las entrañas.

¡Feliz Día!

Responder
Gem@

Hola Vesta bienvenida.
Lamento la contrariedad con el correo, en realidad no lo he visto, pienso que lo más probable es un despiste mio pero lo buscaré porque tengo por costumbre leer y contestar a todos aunque no, con la rapìdez que me gustaría. También es cierto que estos últimos días la conexión no me ha ido bien, y Blogger para no ser menos también ha tenido sus más y sus menos.
Yo siempre digo que no hay personas ignorantes sino personas a las que hay que dar un empujoncito y a partir de ahí todo llega sólo.
He visitado tu blog, me ha sugerido un lugar donde la tranquilidad y la armonía van de la mano. Es fácil perderse en él pero no porque no esté todo bien organizado sino porque su lectura invita a reflexionar, meditar...
Las imágenes son muy bonitas y acorde con la temática.
¿Puedo sugerirte algo?
El logo bajo mi punto de vista desmerece el blog, espero que no te moleste esta observación.
Hay muchas páginas donde puedes descargar un fondo para el logo, o una textura si es más de tu agrado.
El título es bastante largo para el espacio que dispones, quizás con un tipo de fuente más sencilla quedaría más legible el texto.
Y ya puestos que no saliera impreso en el logo la página donde se ha generado.
Si tienes algún fondo que te guste pero no sabes como hacerlo házmelo saber y hacemos un par de pruebas ;) Genial el resultado de la personalización en los títulos ¿no es tan complicado verdad?
Un abrazo.

!Hola Pir@tilla cuanto tiempo¡ tengo que ir a verte, espero que sigas actualizando ¿si?

Iván han quedado geniales.
Dos trabajos en uno, fondo-imagen en una sola imagen ;)

Hola Rosa :)
Feliz día compañera y gracias por acordarte de mi ;)

Responder
Osona Web 2.0

Hola Gemma!

De nuevo recurro a ti, por que me veo en la imposibilidad de ver donde me equivoco una y otra vez, para poder crear un efecto en mi blog de blogger.
Verás he visto en muchos blogs un sistema para las fotos fantástico, no se si se llamara de esta manera pero utilizan una técnica llamada slimbox (que lo he descargado, seguido las instrucciones de Vagabundia, y no acabo de entenderlo) no se si sirve para blogger, pero seria fantástico, cuando le das un click a una imagen del blog, esta se abre sin salirse del blog, como un flash , te dejo varios ejemplos--> http://entomoblog.net/ (cualquier imagen del blog se abre de esta manera, y como no la demo de Vagabundia--> http://vagadata.blogspot.com/2007/10/slimbox.html

Haber si pudieses decirme Gemma como implantar el código, o lo que tenga que hacer en mi plantilla de blogger, para que tenga una visualizacion de las imagenes tan maravillosa.

Muchísimas gracias por las molestias, y como siempre que te escribo...te repito lo mismo...felicidades por tu web, y por tu ayuda...

Un admirador..

Jose Luis

Responder
Gem@

Hola Jose Luís estás en lo cierto Slimbox es una de las librerías más completas que podemos encontrar.
Su utilidad no sólo es para ampliar imágenes como habrás podido ver en el blog de J.Miur.
En realidad las opciones que dan son tan variadas que en un comentario no tendríamos espacio para enumerarlas todas.
Lo que he pensado es que quizás sería mejor crear una entrada basándonos en el tema que te interesa sobre Slimbox como visor de imágenes y dejar para otra ocasión el resto de utilidades.

Responder
Marta Nieves Montero González

¡Muchísimas gracias Gema!

Por tu bienvenida, por las hermosas palabras que le has dedicado a mi blog y por tu acertada opinión sobre mi logo.

Por favor, no dudes en decirme todo aquello que no te parezca bien o que esté mal y yo te aseguro que además de respetarlo y aceptarlo, haré buena cuenta de tu asesoramiento.

Gracias por suavizar mi ignorancia con esa comparación, pero en ese caso, me temo que a mi me tendrás que dar ¡unos buenos empujones! porque de lo contrario, no creo que avanzara nadita.

Por último, darte las GRACIAS por tu ofrecimiento y desearte paz, felicidad y mucha energía positiva.

¡Hasta pronto, cómplice!

Vesta, desde mi corazón

Responder
Carmen

Muchisimas gracias, Gema, lo he aplicado en mi blog y me encanta el efecto, gracias por transmitirnos siempre siempre informacion tan interesante

Responder
Gem@

Gracias de nuevo Vesta ;)

Ha quedado alegre y elegante Carmen, tienes mucho gusto ;)

Responder
MeteoUy

Hola!

La verdad es que entré a tu blog buscando una cosa y buscando entre todas las entradas, descubri un monton de cosas geniales que no sabia. Las cuales ya ando por poner en practica jeje. Este blog en genial!

Tengo una duda, aunque no amerite una entrada para eso aunque sea a traves de un comentario y es la siguiente.

Me bajé una plantilla pero no me gustan donde estan situadas las etiquetas de esa entrada ni tampoco la ubicacion de "comentarios" porque todo aparece arriba ( o sea abajo del titulo ) y queda feo. Se puede mover "fecha" y "comentarios" hacia abajo de cada entrada? en caso de poderse como lo haría?

Responder
MeteoUy

Ah ya ta :P
Ya encontre casualmente en tu blog

Perdon por los comentarios
Saludos!

Responder
Gem@

Bienvenido TR Marcelo a eso le llamo yo rapidez ;)

Responder
Canet Jove

Hola Gema!
Primero darte las gracias por la ayuda que nos das con eso del blog! No sé que haríamos sin vosotros!

Segundo: un preguntitat:
com puedo hacer para que el height de la sidebar sea el mismo que el main. Es que cada vez que añado algun mensaje tengo que retocar el height de la sidebar. Podria modificarse esta automaticamente?

Espero que me haya explicado.. muchissimas gracias!!!

Responder
Gem@

Canet Jove hay plantillas que opor defecto la sidebar tiene el mismo tamaño que el main y no hay que retocar nada, otras nos muestra una sidebar de menor tamaño al main pero que conforme vamos agregando cosas la sidebar va aumentando de tamaño.
Necesito saber que plantilla usas para responderte ;)

Responder
Canet Jove

Uso la 565. Sé que a media que añado se va alargando la sidebar. Pero lo que me gustaria seria que se fuera agrandando confome crece el main.
Por ahora lo voy modificando "manualmente". He introducido el parametro height en sidebar.
Muchissimas gracias

Responder
Gem@

Canet Jove si no es molestia déjame un enlace a tu blog que vea las medidas que tienes en la plantilla.

Responder
Canet Jove

Hola, después de mirar i mirar i buscar i buscar te passo el enlace: http://canet-jove-nothoperdis.blogspot.com/
para que lo veas.. no se que hacer.

Gracias por todo... tu blog nos es muy útil!

Responder
Gem@

Canet Jove así es como se alarga la sidebar primero establece un número de entradas y luego añade a continuación de .sidebar h2 { por ejemplo height:500px;

Responder
Ion Egúzkiza

Hola Gem@: una pregunta muy básica. Me gustaría aprovechar el margen izquierdo de mi blog. Uso la plantilla mímima: ¿cómo puedo desplazar el texto de las entradas hacia la izquierda y meter la side bar en dos columnas? No pierdas mucho tiempo conmigo: me basta con que me des un par de enlaces en tu blog o en otro sitio donde lo expliquen. Mil gracias

Responder
Anónimo

Hola, me gustaría que me ayudaras en una cosa, vi el siguiente blog, http://alguien891.blogspot.com/ y me gusto como la sidebar esta enmarcada en la imagen, podrías expliacarme como se hace, porque lo he intentado todo y no me sale, te lo agradecería mucho

Responder
Gem@

Hola Bastian te pido disculpas porque te hice esperar mucho, no había visto tu comentario hasta hoy :(
Puedes añadir una sidebar siguiendo el enlace.
Si te queda alguna duda házmelo saber ;)

Hola Angelicsan la plantilla que me dices es una plantilla clásica, esa sidebar consta de dos imágenes (como si la cortáramos por la mitad horizontalmente)
La parte superior está añadida justo antes de cada elemento de la sidebar y la de abajo una vez termina el elemento.
No sé que plantilla tienes, pero podría hacerse algo siempre y cuando domines un programa de imágenes para crearlas.
Es cuestión de probar, si te decides me lo haces saber.
;)

Responder
Caruso

Hasta que por fin lo encuentro, lo estaba buscando por todos lados.

Gracias Gema.

PD: Excelente y muy util blog.

Responder
Gem@

Me alegra que lo encontraras Caruso ;)

Responder
Emiliano Ibañez

Pero, queda muy repetitivo si tenes muy usada la sidebar, como poner varias imagenes?

O sea, que en la primera salga una imagen
en la segunda otra
y así

Un beso, fantáaaaaastico blog.

Responder
Gem@

Emiliano el título sólo aparece si lo añades, por lo tanto si añades varias imágenes y no quieres que con cada una te añada un título tienes dos opciones.
1º Añadir todas las imágenes en un mismo elemento de página.
2º Añadir una imagen en diferentes elementos de página sin añadir título ;)

Responder
Anónimo

Gracias me sirvio bastante este es mi blog
Texto
soy de chile adios..!

Responder
Anónimo

¿Y como se haría eso?, intenté de mil maneras ponerlo pero nosé...

Responder
Gem@

Emiliano una entrada es para ti ;)
imagen en los títulos de la sidebar

Responder
Anónimo

Muchísimas gracias, ahora paso por la entrada, eres magnifica.

Responder
Gem@

;)

Responder
Cristina - Laucris

Hola Gem@,
Me encanta tu blog, y me esta ayudando mucho para dejar mas bonito el mio.
Estoy probando lo de poner un imagen y un pequeño borde en el sidebar, pero la imagen se pone encima del titulo, como podria hacer para que no me pasara eso.
Ya he reducido la imagen pero aun asi no me sale bien.

Gracias

Responder
Cristina - Laucris

Perdon Gem@, se me olvido preguntar si conoces alguna pagina donde pudiera buscar alguna imagen para poner en el sidebar de mi blog.

Gracias otra vez.

Responder
Gem@

Hola Cristina, para ubicar la imagen paralela al texto de los títulos haz lo siguiente.
Busca en tu plantilla donde dice:
.sidebar h2{
background-color:#99CC99;
border-bottom: 2px solid #99CC66;
margin:0;
padding:0;
color:#000000;
font: normal normal 135% Georgia, Times, serif;
}

Y sustitúyelo por :
.sidebar h2{
background: url(url-de-la-imagen)no-repeat;
background-color:#99CC99;
margin:0;
padding-left: 30px;
padding-top: 1px;
padding-bottom: 5px;
font: normal normal 80% Georgia, Times, serif;
color:#000000;
}

La imagen debe ser tipo icono, para tu blog iría bien una imagen de botón, agujas, ovillo de lana, cualquier cosa relacionada con la temática. Como a veces es difícil encontrar según que iconos podemos crearlos nosotros mismos ¿cómo? creando un favikon de una imagen que tengamos en nuestro PC.
Mira donde crearlos.
Convierte imágenes en iconos

Suerte ;)

Responder
Akatsuki

Hola. me preguntaba si hay una forma de reemplazar el texto del titulo por una imagen, ya lo he intentado pero no lo he podido hacer, además lo he visto en otros blog. Te agradeceria que me ayudaras

Responder
Gem@

Hola Yurika, añadiendo background: url(url-de-la-imagen); conseguirás que como fondo de los títulos salga una imagen.Lo que ocurre que si añades esa imagen en la CSS de la plantilla (como estamos haciendo en esta entrada) aparecerá en todos los elementos de página la misma imagen.
Si lo que deseas es una imagen diferente para cada elemento puedes hacerlo añadiendo un elemento de página HTML.... incluyendo al principio la imagen y después el contenido de ese elemento.
Cualquier duda me lo dices ;)

Responder
Juno

Hola Gem@, recurro a ti para darte lata, fijate que tengo poco con mi blog, quise cambiarlo, dado que vi unos hermosos por internet, y edite una plantilla, le agregue una columna a la izquierda, entre otros cambios, de los cuales tus enseñanzas son causantes :p, pero curiosamente no logro por medio alguno, que los titulos de la nueva sidebar queden en un formato similar al diseño de la sidebar original, vamos esta nueva tiene los colores inversos, pero... no me va :'(, entre otros detalles, pero ahora mismo, me interesaria que si no queda igual, al menos si se vea mas chica la fuente, no se de donde me esta tomando ese tamaño y estilo :( ya le he dedicado algunos fines de semana y estoy por arrojar la toalla... cuando tengas un tiempecito, estaré más que agradecida Este es.

Responder
David Jiménez Domínguez

Gema soy yo de nuevo, he intentado poner la imagen pero no me funciona me sale el siguiente error:

Por favor, corrige el siguiente error y envía la plantilla de nuevo.
Se ha encontrado más de un artilugio con el ID: LinkList1. Los ID de artilugio deben ser exclusivos.

Mi blog es http://lasevillacofrade.blogspot.com

Responder
Gem@

Juno v ieste comentario ahora, si sigues con las dudas dímelo porque accedí a tu perfil pero no sé de qué blog me hablas :O

yz David ese error quiere decir que hay dos ID iguales, es decir dos elementos que se llaman LinkList1. Blogger no permite tener dos iguales así que lo que hacemos es ir a la plantilla (sin expandirla) y buscar donde dice:
<b:widget id='BlogList1' locked='false' title='aquí pondrá el título' type='BlogList'/>

lo que haremos será sustituir id='BlogList1' por... id='BlogList10'
De esa forma le estamos dando otro nombre distinto ;)

Responder
giovadark

Hola me parece muy util eso de cambiar los titulos de la sidebar por imagenes pero tengo un problema, en mi plantilla no viene la linea
.sidebar h2{ me gustaria saber como le puedo hacer me gustaria que checaras mi blog te lo agradeceria.

Espero tu respuesta

http://www.giovablackmetal666.blogspot.com/

Responder
Gem@

Si no está puedes añadirlo sin ningún problema Giovadark ;)

Responder
Jovenes Amor Viviente

Dios te bendiga mucho Gem@... Tu blog es de muchisima ayuda. Estoy trabajando en un blog de ayuda para los jovenes de mi iglesia y he intentado poner una imagen en los titulos pero no he podido, tampoco pude hacerlo con el post de colocar una imagen. Agradecería mucho tus consejos.

www.jovenesamorviviente.blogspot.com

Responder
Gem@

Jovenes Amor Viviente gracias por el comentario :)
He visto los estilos que añadiste y están perfectos, añadiendo background: url(url-de-la-imagen); se muestra una imagen de fondo en los títulos sin ningún problema.
Si puedes deja los cambios que los pueda ver porque seguro que es algo sin importancia como la url de la imagen o algo por el estilo.

Responder
Manuel

Hola de nuevo Gem@, ya he conseguido cambiar el subrayado de los títulos de la sidebar por un marco. Más adelante intentaré poner una imágen, pero ahora me gustaría que el marco del título llegue hasta el borde de la sidebar y no quede ninguna separación entre ambos pero no lo consigo. Gracias de nuevo por tu ayuda. Saludos.

http://rutasyfotos.blogspot.com

Responder
Gem@

yz Manuel de la forma que lo añadiste el marco queda de extremo a extremo es decir ocupa todo el ancho, ese espacio que ves a los lados son los márgenes que hay añadidos para el contenido si haces la prueba y eliminas el color verde de fondo comprobarás en vista previa lo que trato de decirte.

Responder
Jean Paul

Gracias querida simpre sigo tus indicaciones gracias :):):) ;)

Responder
Gem@

yz Gracias a ti por comentar Jean Paul :)

Responder
Unknown

hola gem2! creo que en algún lado lo pones pero no lo encunetro. quiero cambiar el espaciamiento (REDUCIR) ENTRE LAS LETRAS DE LOS TÍTULOS DE LA SIDEBAR EN HTTP://DINERODESDETUORDNEADOR.BLOGSPOT.COM ¿CÓMO PUEDO HACERLO? UN BESO!!!!

Responder
Gem@

yz Hola lk prueba añadiendo letter-spacing en algo así:
.sidebar h2{
letter-spacing: 0.05em;
Ve mirando en vista previa y ajustando la separación.

Responder
Anónimo

:( no puedo :(

lo he hecho de 400 mil veces distintas y aún no consigo hacer esto... :(:(

please, help me! :(

Responder
Anónimo

te dejo mi email... para que me contactes...

Responder
Anónimo

liila.8@hotmail.com

Responder
Autonomia

Gem@, gracias por tu ayuda!!
pero tengo un problema, yo he aumentado una sidebar a mi blog, y en esa no sale lo q quiero, pero en la otra si...

espero puedas responderme, gracias

Responder
Piqué Passe

Gem@, no me aparece .sidebar h2
Donde tengo que agregarlo?
Gracias!!!

Responder
Gem@

yz Piqué Passe puedes añadirlo después de:
.sidebar {
color: #666666;
line-height: 1.5em;
}
;)

yz Autonomia y Liila siento ver los comentarios con tanto retraso ¿ya lo solucionaron?

Responder
Pique Passé
Este comentario ha sido eliminado por el autor.
Responder
Pique Passé

Gracias!! Quedo muy liiindoooo :):)

Responder
Gem@

yz Estupendo Pique Passé :)

Responder
Anónimo

amigo porque mis titulos del blog aparecen en minusculas (los del sidebar)
kiero que aparescan en mayusculas
me ayudas?
gracias

Responder
Gem@

:: Si para los títulos de la sidebar ya añadiste como indica esta entrada los estilos entonces añades allí lo que está marcado en negrita:

.sidebar h2{
margin:0;
padding-left: 30px;
padding-top: 1px;
padding-bottom: 5px;
text-transform: none;
}

Responder
Anónimo

amigo (a) gem@ te dire que mi pregunta no era respecto al post :P se me habia olvidado decirte osea esta fuera de tema
aora me ayudarias a poner en mayuscula los titulos de mi sidebar?
gracias.

PD: por ejemplo el titulo de tu sidebar empieza asi primero con mayuscula (primera letra) y despues todo con minusculas EJ : De interés...me entiendes?... quiero cambiar eso para que este todo en mayusculas...ya que cuando escribo el titulo en mayusculas igual se ve en minusculas que puede ser?
gracias

Responder
Gem@

:: Fackss yo no veo en tu sidebar títulos, veo el buscador de Google, la nube, publicidad... pero no veo títulos añadidos.
Tendría que ver algún título añadido para decirte en tu plantilla donde puedes modificar esa parte.

Responder
Anónimo

bueno aoa le puse titulos que los escribi en mayusculas pero se ve en minusculas

Responder
Gem@

:: Fackss en los estilos de sidebar h2 cambia text-transform:lowercase; por text-transform:none; de esa forma el texto se mostrará tal y como lo escribes.

Responder
Anónimo

muchas gracias amigo como siempre buenas respuestas
muchas gracias me ha servido mucho

Responder
Anónimo

excelnte gracias

Responder
Gem@

:: Me alegra resultara bien Fackss :)

Responder
ofo1965

No logro dar forma ovalada al fondo de los títulos de la sidebar.
http://convoirunning.blogspot.com/
Que nervios... esto puede conmigo.

Responder
Gem@

:: Pues yo veo ese fondo ovalado ofo1965 :S

Responder
Joel

Hola Gema, mi Problema es que no quiero que aparezca el texto solo la imagen, ya que utilizare esta imagen perzonalizada Link

Responder
Gem@

:: En background de sidebar h2 añades la imagen y en el gadget no le pongas título :)

Responder
Gem@

:: Joel ¿vas a añadir la misma imagen en todos los gadgets de la sidebar :)

Responder
giovadark

Hola Gema, estoy aqui otra vez debido a que queria saber como le hago para que todas las imagenes que tengo en mi sidebar derecha sean de un mismo tamaño, puedes ayudarme por favor. Gracias.

Responder
Tenerife

Hola, estoy intentando poner una imagen de fondo en el título de los Sidebar, pero no hay manera...

El código que me aparece a mí es:

/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
margin: 1.6em 0 .5em;
padding: 4px 5px;
background-color: $sidebarTitleBgColor;
font-size: 100%;
color: $sidebarTitleTextColor;
}

.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
.sidebar li {
margin: 0;
padding-top: 0;
padding-$endSide: 0;
padding-bottom: .5em;
padding-$startSide: 15px;
text-indent: -15px;
line-height: 1.5em;
}
.sidebar {
color: $textColor;
line-height:1.3em;
}
.sidebar .widget {
margin-bottom: 1em;
}

.sidebar .widget-content {
margin: 0 5px;
}

Mi blog es: www.tenerifegay.es

¡NECESITO AYUDA!

Gracias

info@tenerifegay.es

Responder
Gem@

:: giovadark la solución más práctica es modificar esas imágenes con algún editor y ajustarlas todas al miso tamaño antes de añadirlas.

:: Tenerife en el código que tienes como el siguiente modifica lo marcado en negrita.

.sidebar h2 {
margin: 1.6em 0 .5em;
padding: 4px 5px;
background: url(url-de-la-imagen);
font-size: 100%;
color:#000;
}

Esta entrada puede serte útil:
http://gemablog-.blogspot.com/2008/03/personalizar-los-ttulos-de-la-sidebar.html

Responder
Potter.weasly

Hola Gema!

Veras...tengo un problema con la plantilla, y es que amí no me sale el codigo:

.sidebar h2{
background: url(url-de-la-imagen);
margin:0;
padding-left: 30px;
padding-top: 1px;
padding-bottom: 5px;
}


A mi me sale todo esto:


/* Sidebar Content
----------------------------------------------- */
.sidebar {
color: $sidebartextcolor;
line-height: 1.5em;
}

.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}

.sidebar .widget, .main .widget {

border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

.main .Blog {
border-bottom-width: 0;
}


Por cierto, si te sirve de algo mi plantilla es una "Mínima Black" ;)

Responder
Gem@

:: Potter.weasly en la entrada lo dice "para los que no ubiquen esos estilos de sidebar h2 deben añadirlo" ;)

Responder
Isaac Chavero

hola Gema,

en mi blog http://icp-cirugiaestetica.blogspot.com/ modifique el titulo de la sidebar añadiendo bordes y fondo.

El problema es que en los titulos de las entradas si incluyo la fecha, también me aparece la fecha con el mismo borde y sombreado.

Responder
Gem@

:: Así es Isaac, porque los estilos de los títulos de la sidebar están añadidos en
/* Headings
----------------------------------------------- */
h2 {
....
....
....

La fecha adquiere los mismo estilos porque está definida en
h2.date-header {
margin:1.5em 0 .5em;
}

Prueba como dice la entrada a añadir los estilos de los títulos de la sidebar en .sidebar h2 de esa forma sólo los adquieren en la sidebar.


.sidebar h2{
margin:1.5em 0 .75em;
font:normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif;
line-height: 1.6em;
text-transform:normal;
letter-spacing:.1em;
text-align: center;
color:#215670;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-bottom: 1px solid #C94093;
border-left: px solid #78B749;
border-right: px solid #3D81EE;
border-top: px solid #f2984c;
background-color: #d9edff;
}

Responder
Isaac Chavero

Mil gracias, perdona pero a veces leemos las cosas con prisas y no nos fijamos bien en donde poner los codigos.

Gracias por contestar siempre aunque sea para arreglar nuestras torpezas

Responder
Gem@

:: No hay de qué Isaac, eso de leer rápido es algo que me ocurre todos los días con los consiguientes errores :)

Responder
Maria Jesus Novillas Mancho

Hola de nuevo Gema, aquí está de nuevo tu pesadilla :$

Bueno, sin vergüenza, allá que voy.

He logrado cambiar el color de los títulos de la sidebar ¡¡ Bien !!

Pero, palabrita del niño jesús, que yo no tengo ese código. He hecho una búsqueda en la plantilla con los artilugios expandido y únicamente me muestra una entrada que te pego a continuación.



:'(

Cuando puedas, eh, pero sin prisa que ya ves que voy picoteando en todos lados y mientras tanto voy haciendo.

Thanks miles
Chus

Responder
Gem@

:: La Casa de Lalaina esa parte de .sidebar h2 hay que añadirla si no la tenemos.
Veo que te vas de vacaciones ¡qué disfrutes!!

Responder
Antonio Ruiz

Hola Gema.

Más añadidos a mi blog. Un icono en los títulos de la sidebar.

Saludos.

Responder
Gem@

:: Hola Antonio me alegra verte de nuevo :)

Responder
Isaac Chavero

Hola de nuevo Gema,

a veces me atasco en cosas que ya tendría que tener superadas,

Despues de modificar los titulos de la sidebar ¿cómo hago para que todos los widget del blog tengan el mismo estilo en el título?

por ejemplo modifique las columnas del footer siguiendo tus intrucciones y allí si pude copiar los estilos de la sidebar. Pero no se donde ponerlos en el resto, concretamente en los widget que se situan entre las entradas y el footer (www.larevistadecirugiaestetica.com).

gracias

Responder
Gem@

:: Isaac a qué widgets te refieres a las entradas relacionadas en miniaturas?

Responder
Isaac Chavero
Este comentario ha sido eliminado por el autor.
Responder
Isaac Chavero

...en realidad no es un widget de entradas relacionadas. Es un widget de articulos destacados que estoy construyendo con la lista de blogs siguiendo las indicacaciones de Vagabuncia o Rosa (ultimas entradas con imagen).

Si te fijas el titulo provisional "destacados" no coincide con los titulos de los widget de la sidebar o del footer

Responder
Gem@

:: Isaac debes buscar ese gadget en la plantilla y localizar la id del gadget, una vez la tengas entonces haces como en los títulos de la sidebar.
Por ejemplo copias todos los estilos de sidebar h 2 pero en lugar de añadir el nombre de sidebar h2 pones la id del gadget.

Responder
Isaac Chavero
Este comentario ha sido eliminado por el autor.
Responder
Isaac Chavero

Muchas gracias Gema, ya lo había intentado y el problema es que se me copiaban los estilos para el contenido del gadget y no para el titulo, hasta que se me ha encendido la luz y añadi H2 al gadget

Responder
Gem@

:: Así es, el h2 corresponde al título y sin h2 al contenido, quizás me expliqué mal o supuse que te darías cuenta.

Responder
_RosarioZapien_
Este comentario ha sido eliminado por el autor.
Responder
_RosarioZapien_

Tengo Una pregunta Gema saves como poner la imagen que esta en esta pagina http://www.bloggingtips.com/ la imagen del sidebar la e intendado poner pero no puedo! he seguido las instruccionesp pero no me sale con esa imagen

Gem@ plz HelpMe!

mi blog es http://www.elblogr21.blogspot.com
miralo y veras que no aparece!

Responder
Gem@

:: En tu plantilla dice:
.sidebar h2{
background: url(http://www.bloggingtips.com/wp-content/themes/BloggingTips_WP/images/sidebartitle.png);
margin:0;
padding-left: 5px;
padding-top: 2px;
padding-bottom: 5px;
}

Inténtalo de esta forma:

.sidebar h2 {
background: url(url-de-la-imagen) no-repeat scroll center top transparent;
color: #FFFFFF;
float: left;
font-size: 14px;
font-weight: bold;
height: 43px;
line-height: 30px;
margin: 0;
padding: 0 0 0 20px;
text-transform: uppercase;
width: 280px;
}

Responder
Gem@

:: Me olvidaba, tienes dos veces los estilos para esos títulos de la sidebar:
.sidebar h2{
font-size: 17px;
margin: 0px 0px 5px 0px;
}

Con uno es suficiente.

Responder
_RosarioZapien_

@ Gem@ Muchas Gracias Se mira Mejor Que antes :D :D :D yo Queria intentar Que la imagen Como Que sale de las de la sidebar como lo puse en la pag anterior pero en en horabuena! mil! gracias!


-:::Rzm:::-

Responder
_RosarioZapien_

Aaa Se me olvidaba Me suscribire!


__-Rzm-__ (Comentario 100!)

Responder
♥ Ana

Hola Gema, vengo a darte las gracias, ya tenía personalizados los títulos de la sidebar pero, ahora, gracias a ti, los tengo más a mi gusto, he ido leyendo los comentarios y , entre unas respuestas y otras que has ido dando, he conseguido lo que quería, miles de gracias
Y venía a decirte algo que me resulta rarísimo, hace tiempo que quiero ponerte entre mis blogs favoritos, copio tu dirección http, o sea ésta:
http://gemablog-.blogspot.com/
me voy a mi blog,edito mi gadget de los blogs que sigo, pego tu url y nada, no me deja ponerte allí, chica, no lo entiendo, he puesto otros blogs con ese sistema y no entiendo porque me pasa ésto sólo con el tuyo :'(, no veas la rabia que me da.
Un abrazo y una sonrisa :D

Responder
Gem@

:: Me alegra que queda a tu gusto Ana, sobre el problema de añadirme a tus favoritos no sé si te refieres a los seguidores, imagino que el problema es el guión de la url si te fijas tengo un guión al final gemablog- eso lo permitía antes Blogger pero vaya usted a saber por qué ahora ya no lo permite y ocasiona problemas como el que describes |O

Responder
♥ Ana

La cosa era añadirte a mi lista de blogs y, nada , no me sale, sera por el guión que dices , ¡¡hay que fastidiarse con Blogger!!, bueno, no nos quejemos a ver si nos van a complicar más las cosas por otros lados ;)
Voy a seguir cotilleando tu blog, que llevo parte de la tarde por aquí metida, aunque no me veas, estoy, jejejeje
Un abrazo

Responder
Gem@

:: Espero que te tomaras un descanso porque hay para cotillear un rato :D

Responder
♥ Ana

Pues no te creas que descansé mucho, a la noche hasta me lloraban los ojos de tanto mirar la pantalla, jajajaja, estaba sola en casita y hala, dale que te pego con el ordenador y me fijé en que tienes puesto un índice, bueno un mapa del sitio que se abre en ventana aparte y que se abre sólo, es decir no se ve la sidebar al abrirlo, yo tengo puesto un índice pero, al abrirlo, se ve el índice con la sidebar al lado, así que , al ver que lo tenías puesto así, fisgué tu blog por todas partes a ver si hablabas de ello y ¡¡no vi nadaaaaa!!, ainsssss, o tenía las gafas sucias o realmente no hablas sobre ello en tu blog, ¿sería mucho pedir que me explicaras como lo has hecho?
Ya ves que hoy tampoco descanso, jjijiji, me veo en el ordenador toda la tarde otra vez así luego acabo descoyuntada de la espalda,si es que soy masoquista, jajaja
Besotessss

Responder
Gem@

:: Hay una entrada en borrador desde hace tiempo que por una cosa u otra no la terminé, trata sobre el tema que dices de las páginas para ocultar la sidebar al mostrarlas.
Dame unos días y la termino ok? porque es muy largo de explicar en un comentario :)

Responder
♥ Ana

Gem@, ¡¡faltaría más!! te doy todos los días que quieras, además, no tengo nada de prisa y si la tuviera , me aguanto, que tú tienes una vida aparte del blog, así que , con calma, ya iré viniendo para ver cuando lo publicas
Muchísimas gracias por tu ayuda :)

Responder
♥ Ana

Gema, vuelvo, es que me he dado cuenta de que no te he explicado bien como tengo puesto el índice, no lo tengo puesto en una pestaña como tú o una página estática, lo tengo puesto con un códico que puse en una entrada y luego, he puesto un botón en la sidebar para enlazar con dicha entrada donde se ve el índice, entonces igual no tiene nada que ver con lo que me dices tú , además, encima de mis entradas tengo puestos un par de gadgets y al enlazar con el índice también se ve eso, pero, si no es lo mismo que dices tú, no pasa nada, lo dejo como está y listo
Gracias de nuevo y perdón por tanto comentario

Responder
Gem@

:: Hiciste bien en explicarlo pero no es problema, lo que se trata es de la forma de mostrar el índice o cualquier contenido en una página estática dando unos estilos de forma que la sidebar quede oculta al mostrarlo :)

Responder
Caos Alfa
Este comentario ha sido eliminado por el autor.
Responder
El Señor Cuántico

Todas las GRACIAS necesarias para dar la vuelta al planeta.

Magnífica entrada. Antigua pero muy útil.

Mil gracias.

Responder
Victor Santana

hola gema, queria ver si me podias ayudar, quiero poner una imagen de fondo en los titulos de mi sidebar pero por mas que lo intento no me funciona y en mi plantilla no aparece sidebar h2, que puedo hacer?
gracias

Responder
Victor Santana

ahh casi lo olvido.. mi blog es www.mapachezuzo.blogspot.com haha apenas lo estoy comenzando :P

Responder
Gem@

:: Victor Santana en la plantilla no viene esa parte de h2 para los títulos por eso hay que añadirlo :)

Responder
Victor Santana

haha es verdad, ya lo pude hacer, muchas gracias gema :)

Responder
Andrea

Maravilloso, muy bien explicado sencillo y fácil de entender y de hacer. Un saludo.

Responder
Sound System - Cultura en radio

tengo una consulta please! como hago para cambiarle el color a la parte inferior de mi blog.
www.soundsystemgroup.com.ar

Espero que me puedan ayudar!!

Responder
Gem@

:: A qué parte te refieres?? la parte que tiene los enlaces ?

Responder
Eneritz

Hola Gem@! Bueno me han recomendado tu tutorial porque me estoy volviendo loka para conseguir poner una imagen al lado del titulo del gadget. Y el caso es que por más que busco y busco no me sale lo de sidebar content, ni en el blog de pruebas, que es el que modifico antes para no cargarme las plantillas ni en el blog verdadero :S Me preguntaba si me podrías ayudar, porque ya no sé que hacer, me dijeron que buscase algo como data:title y algo de h2 pero tampoco surgió efecto porque tampoco lo tenía :S

Besines^^

Responder
Gem@

:: De qué blog estamos hablando Eneritz?

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top